<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <button id="btn">清除定时器</button>
  <script>

    // setTimeout() 是一个定时器,也是 setTimeout + (), 可以理解成一个函数调用
    // 既然是函数调用,可以理解成 函数调用表达式,表达式是有值的
    // setTimeout() 这个函数的值就是返回值,返回值是 一个定时器的编号
    // 这个编号固定吗? 不固定
    // 这里需要记定时器的编号吗? 不需要,因为在项目中定时器有很多,不确定哪个先执行,所以记这个编号没有意义
    // -------------------
    // clearTimeout(2) 这里放定时器的编号可以清除定时器吗?
    // clearTimeout(2)  这里写定时器的编号是可以清除定时器的,但是一般没有人记定时器的编号,所以没人这么写
    //  -----------------
    // clearInterval(timer1)  可以清除 setTimeout 吗?
    // 可以,但是一般没人这么用
    var timer1 = setTimeout(() => {
      console.log('定时器执行了1')
    }, 1000)

    console.log('timer1', timer1)

    btn.onclick = function () {
      // clearTimeout(2)

      clearInterval(timer1);
    }

  </script>
</body>
</html>